import React, { Component } from 'react'
export class Test extends Component {
  constructor(props) {
    super(props)
    this.state = {
      message: 'Hellow React',
    }
  }
  // setState函数为异步的，可以使用await关键字同步
  async changeText() {
    this.setState(
      {
        message: this.state.message + '6',
      },
      () => {
        console.log('在里面取值', this.state.message)
      }
    )
    //  this.setState(preState => ({
    //   message: preState.message + '7',
    // }))
    console.log('在外面取值', this.state.message)
  }
  componentDidUpdate() { 
    // 在页面更新完成之后获取
    console.log('在componentDidUpdate取值', this.state.message)
  }
  render() {
    return (
      <>
        <div>{this.state.message}</div>
        <button onClick={() => this.changeText()}>改变文本</button>
        <hr />
        <Son message={this.state.message}></Son>
      </>
    )
  }
}
function Son(props) {
  console.log(props.message)
  return (
    <>
      <div>{props.message}</div>
    </>
  )
}
